<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: select2-css"/>
    <th:block th:include="include :: bootstrap-select-css"/>


</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-mainMaterial-edit">
        <input type="hidden" name="id" id="id" th:value="${obj.id}" />
        <h4 class="form-header h4">基本信息</h4>
        <div class="form-group">
            <label class="col-sm-3 control-label">工程公司：</label>
            <div class="col-sm-8">
                <select name="compId" id="compId" class="form-control noselect2">
                    <option value="">请选择</option>
                    <option th:each="pro:${userComp}"
                            th:selected="${obj.compId==pro.compId}"
                            th:value="${pro.compId}"
                            th:text="${pro.compName}"></option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">项目名称：</label>
            <div class="col-sm-8">
                <input id="proName" name="proName" th:value="${obj.proName}" class="form-control" type="text" placeholder="请输入项目名称" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">主材名称：</label>
            <div class="col-sm-8">
                <input name="mainMaterialName" id="mainMaterialName" th:value="${obj.mainMaterialName}" class="form-control" type="text" placeholder="请输入主材名称" />
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">理论用量：</label>
            <div class="col-sm-8">
                <input id="theoreticalDosage" name="theoreticalDosage" th:value="${obj.theoreticalDosage}" class="form-control" type="text" placeholder="请输入理论用量" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">期末累计理论量A：</label>
            <div class="col-sm-8">
                <input id="ljLll" name="ljLll" class="form-control" th:value="${obj.ljLll}" type="text" placeholder="请输入期末累计理论量A" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">期末累计实耗量B：</label>
            <div class="col-sm-8">
                <input id="ljShl" name="ljShl" class="form-control" th:value="${obj.ljShl}" type="text" placeholder="请输入期末累计实耗量B" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">节超量：</label>
            <div class="col-sm-8">
                <input id="nodalExcess" name="nodalExcess" th:value="${obj.nodalExcess}" readonly="readonly" class="form-control" type="text" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">节超率：<span style="color: red">(%)</span></label>
            <div class="col-sm-8">
                <input id="nodalExcessRate" name="nodalExcessRate" th:value="${obj.nodalExcessRate}" class="form-control" readonly="readonly" type="text" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">备注：</label>
            <div class="col-sm-8">
                <input id="remark" name="remark" class="form-control" th:value="${obj.remark}"  type="text" placeholder="请输入备注" />
            </div>
        </div>

    </form>

</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: select2-js"/>
<script type="text/javascript">
    var prefix = ctx + "mainMaterial";
    var data;

    $("#ljShl").blur(function(){
         $("#nodalExcess").val($("#ljLll").val() - $("#ljShl").val());
        $("#nodalExcessRate").val(((($("#ljLll").val() - $("#ljShl").val()) / $("#ljLll").val()) * 100).toFixed(2)+'%');
    });


    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#form-mainMaterial-edit").serializeArray();
            $.operate.save(prefix + "/edit", data);
        }
    }

</script>


</body>

</html>